<!DOCTYPE html >
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=0">
		<title>地址管理</title>
		<!--引入·外部文件-->
		<div th:include="public/pagehead::head"></div>
	</head>

	<body>
		<!--头 -->
		<header>
			<article>
				<div class="mt-logo">
					<!--顶部导航条 -->
					<div th:include="public/pagehead::common"></div>
						<!--悬浮搜索框-->
					<div th:include="public/pagehead::search"></div>
						<div class="clear"></div>
					</div>
				</div>
			</article>
		</header>
		<div class="nav-table">
			<!--全部分类-->
			<div th:include="public/pagehead::category"></div>
		</div>
		<b class="line"></b>

		<div class="center">
			<div class="col-main">
				<div class="main-wrap">

					<div class="user-address">
						<!--标题 -->
						<div class="am-cf am-padding">
							<div class="am-fl am-cf"><strong class="am-text-danger am-text-lg">地址管理</strong> / <small>Address&nbsp;list</small></div>
						</div>
						<hr/>
						<ul class="am-avg-sm-1 am-avg-md-3 am-thumbnails" >

							<li class="user-addresslist" th:each="address: ${addressList}">
								<span class="new-option-r"><i class="am-icon-check-circle"></i>设为默认</span>
								<p class="new-tit new-p-re">
									<span class="new-txt" th:text="${address.getConsignee()}">小叮当</span>
									<span class="new-txt-rd2" th:text="${address.getPhone()}">159****1622</span>
								</p>
								<div class="new-mu_l2a new-p-re">
									<p class="new-mu_l2cw">
										<span class="title">地址：</span>
										<span class="province" th:text="${address.getProvince()}">湖北</span>省
										<span class="city" th:text="${address.getCity()}">武汉</span>市
										<span class="dist" th:text="${address.getDistrict()}">武昌</span>
										<span class="street" th:text="${address.getAddress()}">东湖路75号众环大厦2栋9层902</span>
								</div>
								<div class="new-addr-btn">
									<a href="javascript:void(0);" class="del" th:name="${address.getAddId()}"><i class="am-icon-trash" ></i>删除</a>
								</div>
							</li>
						</ul>
						<div class="clear"></div>
						<a class="new-abtn-type" data-am-modal="{target: '#doc-modal-1', closeViaDimmer: 0}">添加新地址</a>
						<!--例子-->
						<div class="am-modal am-modal-no-btn" id="doc-modal-1">

							<div class="add-dress">

								<!--标题 -->
								<div class="am-cf am-padding">
									<div class="am-fl am-cf"><strong class="am-text-danger am-text-lg">新增地址</strong> / <small>Add&nbsp;address</small></div>
								</div>
								<hr/>

								<div class="am-u-md-12 am-u-lg-8" style="margin-top: 20px;">
									<form class="am-form am-form-horizontal">

										<div class="am-form-group">
											<label for="user-name" class="am-form-label">收货人</label>
											<div class="am-form-content">
												<input type="text" id="user-name" name="name" placeholder="收货人">
											</div>
										</div>

										<div class="am-form-group">
											<label for="user-phone" class="am-form-label" >手机号码</label>
											<div class="am-form-content">
												<input id="user-phone" placeholder="手机号必填" type="email" name="phonNumber">
											</div>
										</div>
										<div class="am-form-group">
											<label for="user-address" class="am-form-label">所在地</label>
											<div class="am-form-content address">
												<select data-am-selected name='province'>
													<option value="a">浙江省</option>
													<option value="b" selected>湖北省</option>
												</select>
												<select data-am-selected name='city'>
													<option value="a">温州市</option>
													<option value="b" selected>武汉市</option>
												</select>
												<select data-am-selected name='country'>
													<option value="a">瑞安区</option>
													<option value="b" selected>洪山区</option>
												</select>
											</div>
										</div>

										<div class="am-form-group">
											<label for="user-intro" class="am-form-label">详细地址</label>
											<div class="am-form-content">
												<textarea class="" rows="3" id="user-intro" placeholder="输入详细地址" name='xxaddress'></textarea>
												<small>100字以内写出你的详细地址...</small>
											</div>
										</div>

										<div class="am-form-group">
											<div class="am-u-sm-9 am-u-sm-push-3">
												<a class="am-btn am-btn-danger submit">保存</a>
												<a href="javascript: void(0)" class="am-close am-btn am-btn-danger" data-am-modal-close>取消</a>
											</div>
										</div>
									</form>
								</div>

							</div>

						</div>

					</div>

					<script type="text/javascript">
						$(document).ready(function() {							
							$(".new-option-r").click(function() {
								$(this).parent('.user-addresslist').addClass("defaultAddr").siblings().removeClass("defaultAddr");
							});
							
							var $ww = $(window).width();
							if($ww>640) {
								$("#doc-modal-1").removeClass("am-modal am-modal-no-btn")
							}
							
						})
					</script>

					<div class="clear"></div>

				</div>
				<!--底部-->
				<div th:include="public/pagehead::footer"></div>
			</div>

			<aside th:include="public/pagehead::person" class="menu">
			</aside>
		</div>
		<script th:src="@{/layuiadmin/layui/layui.all.js}">  </script>
		<script>
            ;!function() {
                //无需再执行layui.use()方法加载模块，直接使用即可
                var form = layui.form
                    , layer = layui.layer;
                var $ = layui.$
                    , admin = layui.admin
                    , element = layui.element
                    , layer = layui.layer
                    , laydate = layui.laydate
                    , form = layui.form;
                form.render();
                laydate.render();
				//提交表单信息
                $('.submit').on('click',function () {
                    var name = $("input[name='name']").val()
                    if(name === ''){
                        console.log('error')
                    }
                    var phonNumber = $("input[name='phonNumber']").val()
                    var province = $("select[name='province'] option:selected").text()
                    var city = $("select[name='city'] option:selected" ).text()
                    var country = $("select[name='country'] option:selected").text()
                    var xxaddress = $("textarea[name='xxaddress']").val()
                    console.log('name='+name+'phonNumber='+phonNumber+'province='+province+'city='+city+'country='+country+'xxaddress='+xxaddress)
                    var personMsg={};
                    personMsg.shouhuoer = name;
                    personMsg.phone = phonNumber;
                    personMsg.shengfen = province;
                    personMsg.city = city;
                    personMsg.qu = country;
                    personMsg.address1 = xxaddress;
                    if (name === ''|| phonNumber===''|| province===''||city===''||country===''||xxaddress===''){
                        layer.msg('请补全信息')
                    }else {
                        $.ajax({
                            url:'address1',
                            type:'post',
                            data:JSON.stringify(personMsg),
                            async:false,
                            contentType: "application/json",
                            success:function (res) {
                               if (res.code == 1){
								   layer.msg(res.msg,{
								       icon:6
								   },function () {
									   window.location.reload()
                                   })
							   }else {
                                   layer.msg(res.msg,{
                                       icon:5
                                   },function () {
                                       window.location.reload()
                                   })
							   }
                            }
                        })
                    }

                })
				//删除地址
				$('.del').click(function () {
					var id = $(this).attr('name');
					layer.confirm('确定删除',function () {
						$.ajax({
							type:'post',
							url:'delAddress',
							data:{id:id},
							dataType:'json',
                           // contentType:'application/json',
							success:function (res) {
                                if (res.code==1){
                                    layer.msg(res.msg,{
                                        icon:6
                                    },function () {
                                        window.location.reload()
                                    })
                                }else{
                                    layer.msg(res.msg,{
                                        icon:5
                                    })
                                }
                            }
						})
                    })
                })
            }();
		</script>
	</body>

</html>